var liveClassify = {
  typeId: '',
  index: 0,
  visible: false,
  timer: null,
  time: 5 * 1000,
  init: function (option) {
    for(var attr in option){
      this[attr] = option[attr]
    }
    if (this.typeId) {
      var data = getTypeListByTypeId({TYPEID: this.typeId})
      page.data.liveClassify = data.TYPEs 
      if (data.TYPEs.length > 1) {
        this.render()
      } else {
        series.init(this.typeId)
        this.show()
      }
    }
  },
  render: function () {
    var classify = page.data.liveClassify
    var html = ''
    if (!classify.length) return
    for (var i = 0; i < classify.length; i++) {
      var column = classify[i]
      var picture = column.typePicture[0].picPath3
      html += '<div class="item" id="classify-' + i + '"><img src="' + picture + '"/></div>'
    }
    $('#classify-container').html(html)
    this.toggleClass()
  },
  next: function (fn) {
    var len = page.data.liveClassify.length
    if (this.index >= len - 1) {
      return
    }
    this.index++
    this.toggleClass(fn)
  },
  prev: function (fn) {
    if (this.index <= 0) {
      return
    }
    this.index--
    this.toggleClass(fn)
  },
  toggleClass: function (fn) {
    $(".item").removeClass('focus')
    $('#classify .item').eq(this.index).addClass('focus')
    this.scrollTop()
    this.show()
    var typeId = page.data.liveClassify[this.index].typeId
    page.data.series = getLiveListByTypeId(typeId).data
    fn && fn()
  },
  scrollTop: function () {
    var len = page.data.liveClassify.length
    var index = this.index
    var view = 4
    var h = 147
    var middle = Math.floor(view / 2)
    var container = $('#classify-container')
    if (index < middle) {
      container.css('top', 0)
    } else if ( len - index < middle ) {
      container.css('top', -(len - view) * h)
    } else {
      container.css('top', -(index - middle) * h)
    }
  },
  show: function () {
    var _this = this
    _this.hide()
    $('#shadow').css('display', 'block')
    _this.visible = true
    _this.timer = setInterval(function () {
      _this.hide()
    }, _this.time)
  },
  hide: function () {
    clearInterval(this.timer)
    this.visible = false
    $('#shadow').css('display', 'none')
  }
}